<template>
  <div class="warpc">
    <div class="assess">
      <div class="oneline">
        <div class="onelinef">评价（402）</div>
        <van-icon name="arrow" @click="fungocomm()" />
      </div>
      <div class="content">
        <div>口味赞（135）</div>
        <div>装修精美（105）</div>
        <div>口服务好（95）</div>
        <div>分量大（42）</div>
        <div>愿意再来（43）</div>
        <div class="cp">上菜慢（23）</div>
        <div>菜质精美（17）</div>
        <div>食材新鲜（16）</div>
        <div>位置好找（16）</div>
      </div>
      <div class="pjcont">
        <div class="left">
          <img src="chenkong/imgs/swipe/1/p4.jpg" alt="" />
        </div>
        <div class="right">
          <div class="pjname">小雨点</div>
          <div class="data">发布于9月24日</div>
          <div class="startdf">
            打分
            <img
              class="start"
              src="chenkong/imgs/shopcenter/start.gif"
              alt=""
            />
            <img
              class="start"
              src="chenkong/imgs/shopcenter/start.gif"
              alt=""
            />
            <img
              class="start"
              src="chenkong/imgs/shopcenter/start.gif"
              alt=""
            />
            <img
              class="start"
              src="chenkong/imgs/shopcenter/start.gif"
              alt=""
            />
            <img
              class="start"
              src="chenkong/imgs/shopcenter/start.gif"
              alt=""
            />
          </div>
          <p class="page">
            我单方面宣布，我和自然觉醒绑定了。昨天去店
            里，阳光灿烂，整个人沐浴在阳光下真滴好舒服
            啊。阳光透过树叶酒下来，听着店里的音乐享受美
            食，这就是周末应该有的样子啊。最开心的是昨天
            吃了烤物蛋糕今天体重还掉了，突破了平台我也是 很意外的。
            最喜欢这边的环境，音乐，阳光洒下来的感觉棒极
            了。其次是美食，这边的食物是我去过几家brunch
            最好的，上次吃的红酒烩牛肉配杂粮面包没了有点 可惜。总之爱了爱了爱了
          </p>
          <div class="pjpic">
            <img src="chenkong/imgs/swipe/1/p3.jpg" alt="" />
            <img src="chenkong/imgs/swipe/1/p4.jpg" alt="" />
          </div>
        </div>
      </div>

      <div class="line"></div>
      <div class="us" @click="funus()">
        <div class="oneline">
          <div class="onelinef">问大家（6）</div>
          <van-icon name="arrow" />
        </div>
        <div class="tw">
          <div class="ask">
            <div class="askle">
              <span class="ques">问</span>
              <span class="conask">请问一下人均大概多少钱呀？</span>
            </div>
            <span class="askre">9 个回答</span>
          </div>
          <div class="ask">
            <div class="askle">
              <span class="ques">问</span>
              <span class="conask">下午六点去会不会甜品都卖完了呀</span>
            </div>
            <span class="askre">5 个回答</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// import { shoplistCK } from "../../../api/chenkong.js";
import axios from "axios";
import { findstoreByidCK } from "../../../api/chenkong.js";

import { tuijianCK } from "../../../api/chenkong.js";

export default {
  data() {
    return {
      obj: [],
      objpl: [],
    };
  },
  methods: {
    funus() {
      this.$router.push("/AskUs");
    },
    fungocomm() {
      this.$router.push("/CommodityPage");
    },
  },
  created() {
    // let i = this.$route.query.i;
    // axios.request("http://localhost:8889/shoplistCK").then(({ data }) => {
    //   this.obj = data[i];
    // });
    console.log(i);
    findstoreByidCK({ tpid: 1 }).then((ok) => {
      // this.shopById = ok.data.data;
      // console.log(ok.data.data);
      this.obj = ok.data.data[i];
      console.log(this.obj);
    });
    tuijianCK().then(({ data }) => {
      console.log(data.data[this.obj.tjid]);
      this.objpl = data.data[this.obj.tjid];
      console.log(this.objpl);
    });
  },
};
</script>

<style lang="scss" scoped>
.warpc {
  width: 100%;
  .assess {
    margin-top: 3.733vw;
    line-height: 6.4vw;
    width: 90%;
    margin: auto;
    .oneline {
      margin-top: 3.733vw;

      display: flex;
      justify-content: space-between;
      .onelinef {
        font-size: 3.733vw;
        font-weight: 700;
      }
    }
    .content {
      margin-top: 4.267vw;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-around;
      div {
        text-align: center;
        width: 31%;
        color: #fc6841;
        border: 0.267vw solid #fc6841;
        font-size: 2.667vw;
        line-height: 5.333vw;
        margin-bottom: 2.133vw;
        border-radius: 1.333vw;
      }
      .cp {
        border: 0.267vw solid #6683c7;
        color: #6683c7;
      }
    }
    .pjcont {
      display: flex;
      justify-content: space-around;
      padding-bottom: 2.133vw;
      border-bottom: 0.267vw solid #f7f7f7;
    }
    .left {
      img {
        width: 10.667vw;
        border-radius: 50%;
      }
    }
    .right {
      margin-left: 1.6vw;
      font-size: 2.667vw;
      .pjname {
        color: #899396;
      }
      .data {
        color: #999999;
      }
      .startdf {
        img {
          width: 3.733vw;
          vertical-align: middle;
        }
      }
      .page {
        overflow: hidden;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
      }
      .pjpic {
        margin-top: 2.667vw;
        img {
          width: 26.667vw;
        }
      }
    }
    .line {
      width: 100%;
      height: 2.133vw;
      background: #f6f6f6;
    }
    .tw {
      margin-top: 1.333vw;
      .ask {
        font-size: 3.2vw;
        display: flex;
        justify-content: space-between;
        .ques {
          background: #fc6841;
          padding: 0.533vw;
          color: #f6f6f6;
        }
        .conask {
          padding-left: 2.133vw;
        }
        .askre {
          color: #999999;
        }
      }
    }
  }
}
</style>